@charset "utf-8";
/*
 * ==============================
 * @description: [WebSite] 首页样式
 * @author: ---
 * @update: ---
 * ==============================
*/

@border_color:#ccc;
@color:#c81623;
/* main 开始 */
.main{
    margin:10px 0 0 219px;
    width:980px;
    height:455px;
    /* focus */
    .focus{
        overflow: hidden;
        position:relative;
        width:720px;
        height:455px;
        ul{
            position: absolute;
            top:0;
            left:0;
            width:600%;
            li{
                float:left;
            }
        }
        .arrow_prev{
            display:none;
            position:absolute;
            top:50%;
            left:10px;
            margin-top:-20px;
            width:24px; 
            height:40px;
            line-height: 40px;
            color:#fff;
            font-size:30px;
            text-align: center;
            background: rgba(0, 0, 0, .3);
            z-index: 2;
        }
        .arrow_next{
            display:none;
            position:absolute;
            top:50%;
            right:10px;
            margin-top:-20px;
            width:24px; 
            height:40px;
            line-height: 40px;
            color:#fff;
            font-size:30px;
            text-align: center;
            background: rgba(0, 0, 0, .3);
            z-index: 2;
        }
        .circle{
            position: absolute;
            bottom:10px;
            left:50px;
            li{
                float:left;
                margin:0 5px;
                width:10px;
                height:10px;
                border:2px solid rgba(255, 255, 255, .5);
                border-radius: 5px;
                cursor: pointer;
                &.current{
                    box-sizing:border-box;
                    background-color: #fff;
                    box-shadow: rgba(255, 255, 255, .5) 0 0 0 3px;
                }
            }
        }
    }
    /* newsflash */
    .newsflash{
        width:250px;
        height:455px;
        .news{
            height:163px;
            border:1px solid #ccc;
            .news-hd{
                height:32px;
                line-height:32px;
                font-size: 14px;
                padding:0 15px;
                border-bottom:1px dotted #ccc;
                a{
                    float:right;
                    font-size:12px;
                    i{
                        margin-left:7px;
                    }
                }
            }
            .news-bd{
                padding:10px 0 0 15px;
                li{
                    height:23px;
                    span{
                        font-weight:700;
                        margin-right:7px;
                    }
                }
            }
        }
        .lifeservice{
            overflow:hidden;
            height:208px;
            border:1px solid #ccc;
            border-top:none;
            ul{
                width:252px;
            }
            li{
                position: relative;
                float:left;
                width:63px;
                height:70px;
                border-right:1px solid #ccc;
                border-bottom:1px solid #ccc;
                a{
                    display:block;
                    /* 解决 i 引起的外边距合并问题 */
                    overflow: hidden;
                    height:100%;
                    .service-ico{
                        display:block;
                        margin:10px auto;
                        width:24px;
                        height:24px;
                        background: url(../images/icons.png) no-repeat;
                        &.service-ico-huafei{
                            background-position: -17px -16px;
                        }
                        &.service-ico-jipiao{
                            background-position: -78px -16px;
                        }
                        &.service-ico-dianying{
                            background-position: -142px -16px;
                        }
                        &.service-ico-youxi{
                            background-position: -206px -16px;
                        }
                        &.service-ico-caipiao{
                            background-position: -17px -87px;
                        }
                        &.service-ico-jiayou{
                            background-position: -80px -87px;
                        }
                        &.service-ico-jiudian{
                            background-position: -142px -87px;
                        }
                        &.service-ico-dianying{
                            background-position: -142px -87px;
                        }
                        &.service-ico-huoche{
                            background-position: -207px -87px;
                        }
                        &.service-ico-zhongchou{
                            background-position: -17px -157px;
                        }
                        &.service-ico-licai{
                            background-position: -79px -159px;
                        }
                        &.service-ico-lipin{
                            background-position: -143px -153px;
                        }
                        &.service-ico-baitiao{
                            background-position: -206px -158px;
                        }
                    }
                    p{
                        text-align: center;
                    }
                    .hot{
                        position: absolute;
                        top:0;
                        right:0;
                        color:#49954B;
                    }
                }
            }
        }
        .bargain{
            margin-top:5px;
            height:75px;
        }
    }
}

/* 今日推荐 */
.recommend{
    margin-top:10px;
    height:163px;
    .recom-hd{
        width:200px;
        height:163px;
        background-color: #5c5251;
        text-align: center;
        img{
            margin:30px 0 15px 0;
        }
        h3{
            font-size:18px;
            color:#fff;
        }
    }
    .recom-bd{
        overflow: hidden;
        width:1000px;
        height:163px;
        background-color: #ebebeb;
        li{
            float:left;
            margin-top:10px;
            width:249px;
            height:163px;
            border-right:1px solid #ccc;
            &:last-child{
                border:none;
            }
        }
    }
}
/* floor 开始 */
.box-hd{
    margin-top: 25px;
    height:30px;
    border-bottom:2px solid @color;
    h3{
        font-size:18px;
        color:@color;
    }
    .tab-list{
        line-height:30px;
        li{
            float:left;
            a{
                margin:0 10px;
            }
        }
    }
}
.w-210{
    width:210px;
    background-color: #f9f9f9;
}
.w-330{
    width:330px;
}
.w-219{
    width:219px;
    border-right:1px solid @border_color;
}
.w-220{
    width:220px;
    border-right:1px solid @border_color;
}
.box-bd{
    overflow: hidden;
    height:361px;
    img{
        transition: all .3s;
     &:hover{
         margin-left:8px;
     }   
    }
    .tab-con-list{
        overflow: hidden;
        margin-bottom:37px;
        li{
            margin-left:10px;
            width:86px;
            height:32px;
            line-height:32px;
            border-bottom:1px solid @border_color;
            text-align: center;
        }
    }
    .tab-con{
        height:361px;
        li{
            overflow: hidden;
            float:left;
            .tab-con-item{
                border-bottom:1px solid @border_color;
            }
        }
    }
}
.box-link{
    overflow: hidden;
    margin-top:25px;
    padding:10px 0;
    height:80px;
    background-color: #f9f9f9;
    li{
        float:left;
        width:120px;
        line-height:60px;
        text-align: center;
        border-right:1px dotted @border_color;
        &:last-child{
            border: none;
        }
    }
}
/* 电梯导航 */
.fixedtool{
    position:fixed;
    top:300px;
    left:50%;
    margin-left:-676px;
    width:66px;
    background-color:#fff;
    li{
        height:32px;
        line-height:32px;
        font-size:12px;
        text-align:center;
        border-bottom:1px solid @border_color;
        cursor: pointer;
        &.current{
            background-color: @color;
            color:#fff;
        }
        &:hover{
            .current
        }

    }
}
// 回到顶部
.toTop{
    position:fixed;
    bottom:50px;
    right:50px;
    margin-top:30px;
    background-color: @color;
    color:#fff;
    text-align: center;
    cursor: pointer;
    div{
        width:32px;
        &.topico{
            border-bottom:1px dashed #fff;
        }
    }
}